<template>
	<view class="main">
		<view class="block1">
			<view>
				<icon type="success" size="80" color="#006EFF"/>
			</view>
			<view class="text">预约成功</view>
		</view>
		<view class="block2">
			<view class="item">
				<text class="itemText">就诊医院</text>
				<text>{{listData[0].hospital_name}}</text>
			</view>
			<view class="item">
				<text class="itemText">医院地址</text>
				<text>{{listData[0].hospital_address}}</text>
			</view>
			<view class="item">
				<text class="itemText">报到地点</text>
				<text>{{listData[0].department_reported}}</text>
			</view>
			<view class="item">
				<text class="itemText">预约项目</text>
				<text>{{arrData.packageName}}</text>
			</view>
			<view class="item">
				<text class="itemText">报到时间</text>
				<text>{{listData[0].report_time}}</text>
			</view>
			<view class="item">
				<text class="itemText">就诊时间</text>
				<text>{{listData[0].waiting_time}}</text>
			</view>
			<view class="item">
				<text class="itemText">费 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;用</text>
				<text class="money">￥<text>{{arrData.packagePrice}}</text></text>
			</view>
			<view class="item">
				<text class="itemText">预约时间</text>
				<text>{{listData[0].patients_appointmentTime}}</text>
			</view>
		</view>
		<view class="block2">
			<view class="item">
				<text class="itemText">就&nbsp;诊&nbsp;人</text>
				<text>{{listData[0].patients_name}}</text>
			</view>
			<view class="item">
				<text class="itemText">身份证号</text>
				<text>{{listData[0].patients_id_number}}</text>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		ref,
		toRefs,
		reactive,
		getCurrentInstance
	} from 'vue'
	export default {
		setup() {
			const data=reactive({
				listData:[],
				arrData:{}
			})
			
			data.listData=uni.getStorageSync('listData');
			console.log(data.listData);
			data.arrData=uni.getStorageSync('arrData');
			console.log(data.arrData);
			
			return {...toRefs(data)}
		}
		
	}
</script>

<style>
.main{
	padding: 30rpx;
	box-sizing: border-box;
}
.block1{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	margin-bottom: 30rpx;
}
.text{
		font-size: 40rpx;
		padding: 20rpx;
		box-sizing: border-box;
}
.block2{
	border: 1px solid rgba(0, 0, 0, 0.2);
	box-shadow:  1px 2px 2px 1px rgba(0, 0, 0, 0.2);
	padding: 0 20rpx;
	box-sizing: border-box;
	margin-bottom: 30rpx;
}
.item{
	border-bottom: 1px solid rgba(0, 0, 0, 0.2);
	padding-bottom: 30rpx;
	padding-top: 30rpx;
	box-sizing: border-box;
}
.itemText{
	color: rgba(0, 0, 0, 0.5);
	padding-right: 20rpx;
	box-sizing: border-box;
}
.money{
	color: coral;
}
.item text:nth-child(2){
	font-size: 28rpx;
}
</style>
